<!doctype html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <title>显示所有比赛项目信息</title>
  <script src="js/axios-0.21.0.js"></script>
  <script src="js/vue.js"></script>
  <!-- 引入样式 -->
  <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
  <!-- 引入组件库 -->
  <script src="https://unpkg.com/element-ui/lib/index.js"></script>
</head>

<body>
<div id="app">
  <el-row>
    <el-col :span="6">
      <span style="font-size:30px">高校运动会管理系统</span>
    </el-col>
    <el-col :span="18">
      <el-menu :default-active="activeIndex" mode="horizontal">
        <el-menu-item index="1"><el-link href="index.html">首页</el-link></el-menu-item>
        <el-submenu index="2">
          <template slot="title">运动员管理</template>
          <el-menu-item index="2-1"><el-link
                  :href="'athletesList.html?role='+role">运动员列表</el-link></el-menu-item>
          <el-menu-item index="2-2" v-if="role==0"><el-link
                  :href="'athletesAdd.html?role='+role">添加运动员</el-link></el-menu-item>
        </el-submenu>
        <el-submenu index="3">
          <template slot="title">裁判管理</template>
          <el-menu-item index="3-1"><el-link
                  :href="'judgeList.html?role='+role">裁判列表</el-link></el-menu-item>
          <el-menu-item index="3-2" v-if="role==0"><el-link
                  :href="'judgeAdd.html?role='+role">增加裁判</el-link></el-menu-item>
        </el-submenu>
        <el-submenu index="4">
          <template slot="title">比赛项目管理</template>
          <el-menu-item index="4-1"><el-link
                  :href="'itemList.html?role='+role">比赛项目列表</el-link></el-menu-item>
          <el-menu-item index="4-2" v-if="role==0"><el-link
                  :href="'itemAdd.html?role='+role">增加比赛项目</el-link></el-menu-item>
        </el-submenu>
        <el-submenu index="5">
          <template slot="title">场地管理</template>
          <el-menu-item index="5-1"><el-link
                  :href="'GroundList.html?role='+role">场地列表</el-link></el-menu-item>
          <el-menu-item index="5-2" v-if="role==0"><el-link
                  :href="'GroundAdd.html?role='+role">增加场地</el-link></el-menu-item>
        </el-submenu>
        <el-submenu index="6">
          <template slot="title">留言管理</template>
          <el-menu-item index="6-1"><el-link
                  :href="'commentList.html?role='+role">留言查询</el-link></el-menu-item>
        </el-submenu>
        <el-submenu index="7">
          <template slot="title">报名管理</template>
          <el-menu-item index="7-1"><el-link
                  :href="'registerList.html?role='+role">报名查询</el-link></el-menu-item>
          <el-menu-item index="7-2" v-if="role==2"><el-link
                  :href="'registerAdd.html?role='+role">报名</el-link></el-menu-item>
          <el-menu-item index="7-3" v-if="role==0 || role ==1"><el-link
                  :href="'registerListAll.html?role='+role">报名审批</el-link></el-menu-item>
        </el-submenu>
        <el-submenu index="8">
          <template slot="title">成绩管理</template>
          <el-menu-item index="8-1"><el-link @click="dialogAthletes=true">查询成绩</el-link></el-menu-item>
          <el-menu-item index="8-2" v-if="role==0 || role ==1"><el-link @click="dialogItems=true">录入成绩</el-link></el-menu-item>
          <el-menu-item index="8-3" v-if="role==2"><el-link @click="dialogItems=true">根据项目查询成绩</el-link></el-menu-item>
        </el-submenu>
        <el-submenu index="9">
          <template slot="title">个人中心</template>
          <el-menu-item index="9-1" @click="logout">退出</el-menu-item>
          <el-menu-item index="9-2" @click="userEdit(id)">编辑</el-menu-item>
        </el-submenu>
      </el-menu>
    </el-col>
  </el-row>
  <el-table :data="list" border stripe style="width: 100%">

    <el-table-column header-align="center" align="center" prop="scoreId" label="序号" type="index" width="200">
    </el-table-column>
    <el-table-column prop="athletesId" label="运动员ID" width="200">
    </el-table-column>
    <el-table-column prop="itemId" label="项目ID" width="200">
    </el-table-column>
    <el-table-column prop="itemName" label="比赛项目">
    </el-table-column>
    <el-table-column prop="score" label="分数">
    </el-table-column>
    <el-table-column prop="ranking" label="排名" width="100">
    </el-table-column>
    </el-table-column>
    <el-table-column header-align="center" align="center" label="操作">
      <!-- 自定义列模板-->
      <template slot-scope="scope">
        <el-button size="mini" type="primary" @click="dianZan">点赞</el-button>

      </template>
    </el-table-column>
  </el-table>

  <!--    查询成绩-->
  <el-dialog title="提示" :visible.sync="dialogAthletes" width="30%">
    <el-form ref="form" :model="scaaa" label-width="80px">
      <el-form-item label="运动员名">
        <el-input v-model="scaaa.athletesName" placeholder="请输入运动员名"></el-input>
      </el-form-item>

      <el-form-item>
        <el-button type="primary" @click="showByAthletesName">查询</el-button>
        <el-button @click="dialogAthletes=false">取消</el-button>
      </el-form-item>
    </el-form>
  </el-dialog>

  <el-dialog title="提示" :visible.sync="dialogItems" width="30%">
    <el-form ref="form" :model="scaaa" label-width="80px">
      <el-form-item label="项目名">
        <el-input v-model="scaaa.itemName" placeholder="请输入项目名"></el-input>
      </el-form-item>

      <el-form-item>
        <el-button type="primary" @click="showByItemName">查询</el-button>
        <el-button @click="dialogItems=false">取消</el-button>
      </el-form-item>
    </el-form>
  </el-dialog>

</div>
<script type="text/javascript">

  new Vue({
    el: "#app",
    data: {
      id:-1,
      activeIndex: "8-1",
      list: [],
      dialogAthletes: false,
      dialogItems: false,
      scaaa: { // 为了在顶部的成绩管理弹出对话框
        athletesName: "",
        itemName: ""
      },
      role:""
    },

    created() {
      let queryString = window.location.search;
      let urlParams = new URLSearchParams(queryString);
      this.role = urlParams.get('role');
      axios.get("/score/athlesName" + location.search)
              .then(resp => {
                if (resp.status === 200) {
                  if (resp.data.code === 200) {
                    this.list = resp.data.data;
                  } else if (resp.data.code === 400) {
                    this.$confirm('运动员不存在', '提示', {
                      confirmButtonText: '确定',
                      type: 'warning'
                    }).then(() => {
                      location.href = 'index.html'
                    });
                  }
                }
              });
      axios.get('user/getUser').then(res =>{
        if(this.role === '0'){
          this.id=res.data.user.adminId
        } else if(this.role === '1'){
          this.id=res.data.user.judgeId
        } else if(this.role === '2'){
          this.id=res.data.user.athletesId
        }
      })
    },
    methods: {
      showByAthletesName() {
        location.href = "sc111.html?athletesName=" + this.scaaa.athletesName + "&role=" + this.role
      },
      showByItemName() {
        location.href = "sc222.html?itemName=" + this.scaaa.itemName + "&role=" + this.role
      },
      userEdit(id) {
        location.href = "athletesUpdate.html?id=" + id + "&role=" + this.role;
      },
      logout() {
        axios.get('http://localhost:8080/user/logout')
                .then(resp => {
                  if (resp.data.message == 'success') {
                    alert(resp.data.message)
                    location.href = 'login.html';
                  } else {
                    alert(resp.data.message)
                  }
                }).catch(error => console.log(error))
      },
      showByAthName() {
        axios.get("/score/athlesName" + location.search)
                .then(resp => {
                  console.log(resp.data)
                  this.list = resp.data
                  console.log(this.list)
                }).catch(error => console.log(error))
      },
      edit(id) {
        location.href = "itemUpdate.html?id=" + id;
      },
      dianZan() {
        alert("感谢点赞！！！！！");
      }


    }
  })
</script>
</body>

</html>